<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
	String path = request.getContextPath();
	request.setAttribute("path", path);//只是为了让el表达式更短一些
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>

<!DOCTYPE HTML>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<base href="<%=basePath%>">

<title>通知</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="expires" content="0">
<meta name="keywords" content="keyword1,keyword2,keyword3">
<meta name="description" content="This is my page">
<link rel="icon" href="favicon.ico">

<!-- Bootstrap core CSS -->
<link href="${path}/res/css/bootstrap(2).min.css" rel="stylesheet">
<!-- Bootstrap theme -->
<link href="${path}/res/css/bootstrap-theme.min.css" rel="stylesheet">

<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
      <script src="${path}/res/js/html5shiv.min.js"></script>
      <script src="${path}/res/js/respond.min.js"></script>
    <![endif]-->
</head>

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>

<body class="container" ng-app="myapp">
	<jsp:include page="/header.jsp"></jsp:include>
	<!-- =======================header=========================== -->
	<div class="container">
		<div class="row">
			<div class="btn-group">
				<button type="button" class="btn btn-primary dropdown-toggle"
					data-toggle="dropdown">
					时间 <span class="caret"></span>
				</button>
				<ul class="dropdown-menu" role="menu">
					<li><a href="message?pageNum=${pageNum }&order=timeInc">递增</a></li>
					<li class="divider"></li>
					<li><a href="message?pageNum=${pageNum }&order=timeDec">递减</a></li>
				</ul>
			</div>
			<div class="btn-group">
				<button type="button" class="btn btn-primary dropdown-toggle"
					data-toggle="dropdown">
					课程号 <span class="caret"></span>
				</button>
				<ul class="dropdown-menu" role="menu">
					<li><a href="message?pageNum=${pageNum }&order=teachInc">递增</a></li>
					<li class="divider"></li>
					<li><a href="message?pageNum=${pageNum }&order=teachDec">递减</a></li>
				</ul>
			</div>
		</div>
		<div class="row">
			<div class="panel-group" role="tablist">
				<div class="panel panel-default">
					<div class="panel-heading panel-title"
						id="collapseListGroupHeading1">
						<div class="row">
							<div class="col-sm-8 col-xs-8 row">
								<div class="col-sm-1 col-xs-1 text-center">#</div>
								<div class="col-sm-4 col-xs-4 text-center">通知标题</div>
								<div class="col-sm-3 col-xs-3 text-center">课程</div>
								<div class="col-sm-4 col-xs-4 text-center">上传时间</div>
							</div>
							<div class="col-sm-4 col-xs-4">
								<div class="row">
									<div class="col-sm-10 col-xs-10 text-center">附件</div>
									<div class="col-sm-2 col-xs-2 text-center">操作</div>
								</div>
							</div>
						</div>
					</div>
					<div class="panel-collapse" id="hello"
						ng-controller='MessageController' role="tabpanel"
						aria-labelledby="collapseListGroupHeading1" aria-expanded="true"
						style="">
						<ul class="list-group">
							<li class="list-group-item" ng-mouseover="mousein($index)"
								ng-repeat="row in messages">
								<div class="row">
									<div class="col-sm-8 row" data-toggle="collapse"
										data-target="#demo{{$index}}" style="cursor: pointer;">
										<div class="col-sm-1 col-xs-1 text-center" ng-bind="$index"></div>
										<div class="col-sm-4 col-xs-4 text-center" ng-bind="row.title"></div>
										<div class="col-sm-3 col-xs-3 text-center"
											ng-bind="row.course"></div>
										<div class="col-sm-4 col-xs-4 text-center" ng-bind="row.time"></div>
									</div>
									<div id="demo{{$index}}" class="collapse row">
										<div class="col-sm-2 col-xs-2 text-center">内容:</div>
										<div class="col-sm-10 col-xs-10" ng-bind="row.content"></div>
									</div>
									<div class="col-sm-4 col-xs-4">
										<div class="row">
											<div class="col-sm-10 col-xs-10 text-center"
												ng-bind="row.file"></div>
											<div class="col-sm-2 col-xs-2 text-center"
												ng-show='$index == selectedRow && row.id != -1'>
												<a href="download?fileID={{row.id}}" data-toggle="tooltip"
													data-placement="left" title="下载"><span
													class="glyphicon glyphicon-download-alt"></span></a>&nbsp;
											</div>
										</div>
									</div>
								</div>
							</li>
						</ul>
					</div>
				</div>
			</div>
		</div>
	</div>
	<nav>
		<ul class="pagination">
			<li><a href="message?pageNum=1">&laquo;</a></li>
			<%
				int i = 1;
				Integer cnt = (Integer) request.getAttribute("pageCount");
				for (; i <= cnt; i++) {
					if ((Integer) request.getAttribute("pageNum") == i) {
			%>
			<li class="active"><a href="message?pageNum=<%=i%>"><%=i%></a></li>
			<%
				} else {
			%>
			<li><a href="message?pageNum=<%=i%>"><%=i%></a></li>
			<%
				}
				}
			%>
			<li><a href="message?pageNum=<%=cnt%>">&raquo;</a></li>
		</ul>
	</nav>


	<!-- ========================footer========================== -->
	<jsp:include page="/footer.jsp"></jsp:include>
	<!-- Bootstrap core JavaScript
    ================================================== -->
	<!-- Placed at the end of the document so the pages load faster -->
	<script src="${path}/res/js/jquery.min.js"></script>
	<script src="${path}/res/js/bootstrap.min.js"></script>
	<script src="${path}/res/js/angular.min.js"></script>
	<script src="${path}/res/js/message.js"></script>
	<script type="text/javascript">
		var messages = '${messageJson}';
	</script>
</body>
</html>
